<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文章列表--layui后台管理模板</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="../../js/layui/css/layui.css" media="all" />
<script src="../../js/layui/layui.js"></script>
<link rel="stylesheet" href="../../css/font_eolqem241z66flxr.css"
	media="all" />
<link rel="stylesheet" href="../../css/news.css" media="all" />

<style type="text/css">
.layui-table-cell {
	text-align: center;
	height: auto;
	white-space: normal;
	width: auto;
}
</style>
</head>
<body class="childrenBody">
	<blockquote class="layui-elem-quote news_search">
		<form class="layui-form" method="post" onsubmit="return false;">
			<label class="layui-form-mid">会员姓名:</label>
			<div class="layui-input-inline">
				<input type="text" id="name" name="name" placeholder="请输入会员名"
					autocomplete="off" class="layui-input">
			</div>

			<label class="layui-form-mid">选择框</label>
			<div class="layui-input-inline">
				<select id="alternative1" lay-verify="required">
					<option value=""></option>
					<option value="男">男</option>
					<option value="女">女</option>
				</select>
			</div>
			
			
			 <div class="layui-inline">
    <label class="layui-form-label">注册和更新</label>
    <div class="layui-input-inline" >
      <input type="text" name="startTime" id="startTime" autocomplete="off" class="layui-input">
    </div>
    <div class="layui-inline">-</div>
    <div class="layui-input-inline" >
      <input type="text" name="endTime" id="endTime" autocomplete="off" class="layui-input">
    </div>
  </div>
			<div class="layui-input-inline" style="width: 100px;">
				<button class="layui-btn" id="search" data-type="reload">搜索</button>
			</div>
			
		</form>

	</blockquote>
	<div class="layui-form links_list">
		<table class="layui-table" id="deigner" lay-filter="table">

		</table>
	</div>

	<!-- <div id="page"></div> -->
	
	<script type="text/javascript">
		layui.use([ 'table', 'layer' ,'laydate'],function() {
							var table = layui.table, $ = layui.$, layer = layui.layer;
							var laydate=layui.laydate;
							
							laydate.render({ 
								  elem: '#startTime'
								  ,type: 'datetime'
								});
							laydate.render({ 
								  elem: '#endTime'
								  ,type: 'datetime'
								});
							
							table.render({
										elem : '#deigner',
										url : 'http://localhost:8080/Greenleaf/vip/get' //数据接口
										,
										page : true,
										limit : 2,
										limits : [ 2, 3, 5 ],
										cols : [ [ //表头
												{
													field : 'vId',
													title : '编号',
												},
												{
													field : 'vName',
													title : '姓名',
												},{
													field : 'vImg',
													title : '头像',
													templet : '<div><img src="../../../{{d.vImg}}" /></div>'
												}, {
													field : 'vPhone',
													title : '手机号',
												}, {
													field : 'email',
													title : '邮箱',
												},{
													field : 'vPassword',
													title : '密码',
												},{
													field : 'brithday',
													title : '生日',
												},{
													field : 'sex',
													title : '性别',
												},{
													field : 'sTime',
													title : '注册时间',
												},{
													field : 'uTime',
													title : '更新时间',
												}
										] ],
										id : "DesignerReload"
									});
							$("#search").click(function() {
												table.reload('DesignerReload',
																{url : 'http://localhost:8080/Greenleaf/vip/get',
																	page : {
																		curr : 1
																	//重新从第 1 页开始
																	},
																	where : {
																		name : $("#name").val()
																		,alternative1 : $("#alternative1").val()
																		,startTime : $("#startTime").val()
																		,endTime : $("#endTime").val()
																	}
																});
											
											});
							
						})
	</script>
 </body>
</html>